import 'package:chathouse/constant/my_color.dart';
import 'package:chathouse/util/base_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'form_widgets.dart';

typedef MyMultipleSelectWidgetItemChange = Function(List<String> val);

//問題類型2 多選
class MultipleSelectWidget2 extends StatefulWidget {
  String title;
  List<String> selectedValue;
  List<KeyValueBean> initValue;
  MyMultipleSelectWidgetItemChange onSelectedItemChange;
  bool request;

  MultipleSelectWidget2(
      this.title, this.selectedValue, this.initValue, this.onSelectedItemChange,
      {this.request = false, Key? key})
      : super(key: key);

  @override
  State<MultipleSelectWidget2> createState() => _MultipleSelectWidget2State();
}

class _MultipleSelectWidget2State extends State<MultipleSelectWidget2> {
  @override
  Widget build(BuildContext context) {
    double itemW = (1.sw - 26.w * 2 - 20.w) / 2.0 - 0.1;
    return Container(
        padding: EdgeInsets.only(left: 26.w, right: 26.w),
        child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
          Row(crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              widget.request
                  ? Text(
                      "*",
                      style: getTextStyle(18.sp, color: Colors.red),
                    )
                  : Container(),
              Expanded(
                  child: Text(
                widget.title,
                style: getTextStyle(18.sp, color: Colors.black),
              ))
            ],
          ),
          SizedBox(
            height: 12.w,
          ),
          Wrap(
            spacing: 20.w,
            runSpacing: 20.w,
            children: widget.initValue.map((e) {
              bool isSelected = widget.selectedValue.contains(e.value);
              return Container(
                padding: EdgeInsets.all(6.w),
                constraints:
                    BoxConstraints(minWidth: itemW, maxWidth: itemW * 2 + 20.w),
                decoration: BoxDecoration(
                    color: isSelected ? MyColors.green_204243165 : Colors.white,
                    border:
                        Border.all(width: 1.w, color: MyColors.gary_158157157),
                    borderRadius: BorderRadius.circular(100.w)),
                child: Text(
                  e.name,
                  textAlign: TextAlign.center,
                  style: getTextStyle(16.sp, color: Colors.black),
                ),
              ).setOnClickListener(() {
                setState(() {
                  if (widget.selectedValue.contains(e.value)) {
                    widget.selectedValue.remove(e.value);
                  } else {
                    widget.selectedValue.add(e.value);
                  }
                });
                widget.onSelectedItemChange(widget.selectedValue);
              });
            }).toList(),
          ),
        ]));
  }
}
